[v-cloak]{display:none}
.cur{cursor:pointer}
.flex-rict{display:flex;align-items:center;justify-content:flex-end}
.flex-ct{align-items:center;-moz-justify-content:center;-ms-justify-content:center;-o-justify-content:center;-ms-flex-pack:justify;justify-content:center}
.flex-bect{align-items:center;-moz-justify-content:space-between;-ms-justify-content:space-between;-o-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}
.flex-lect{-moz-align-items:center;-ms-jalign-items:center;-o-align-items:center;-ms-flex-pack:align;align-items:center}
.flex1{flex:1;width:100%}
.box{max-width:100%;min-width:92%}
.main-layout{overflow:hidden}#header{position:fixed;z-index:30;background-color:#fff;width:100%;top:0;max-width:750px}
#header .top{height:50px}


#banner{position: relative; margin-bottom: 16px;}
#banner .ban-dot{position: absolute; width: 100%; left: 0; bottom: 4px; z-index: 1; text-align: center;}
#banner .ban-dot span{background-color: #fff; opacity: 0.2; width: 8px; height: 8px; margin: 0 2px;}
#banner .ban-dot span.swiper-pagination-bullet-active{opacity: 1;}


.select-main{margin-bottom: 0.4rem;}
.select-main .input{display: flex; align-items: center; justify-content: space-between; width: 100%; flex: 1;}
.select-main .select-box::after{content: ''; display: block; width: 30px;height: 44px; background-image: url(../image/jt-1.svg); background-position: center; background-repeat: no-repeat; background-size: 0.2rem; transition: all ease .3s;}


.select-main .tips{color: #666;}
.select-main .select-box{width: 100%;height: 44px; border: 1px solid #ededed; border-radius: 4px; padding: 0 10px; display: flex; align-items: center;}
.select-main .select-box.on::after{transform: rotate(180deg);}
.red{color: red;}
.title{font-weight: bold;}
.m-tips{color: #666; padding: 8px 0;}

.product-list{display: flex; justify-content: space-between; flex-wrap: wrap; padding-top: 16px;}
.product-list .item{width: 48%; border: 1px solid #ededed; margin-bottom: 10px; border-radius: 4px; overflow: hidden;}
.product-list .imgW{width: 100%; height: 3rem;}
.product-list .img{display: block; width: 100%; height: 100%; object-fit: cover;}
.product-list .name{font-size: 0.3rem; display: flex; align-items: center; height: 0.7rem; color: #000; padding: 0 10px; border-bottom: 1px solid #ededed; font-size: 14px; font-weight: bold; border-top: 1px solid #ededed;}
.product-list .price{color: red; font-weight: bold;}
.product-list .kucun{color: #999;}
.product-list .bottom{display: flex; align-items: center; justify-content: space-between; font-size: 12px;}
.product-list .btn{width: 26px; height: 26px; display: flex; align-items: center; justify-content: center;}
.product-list .input{width: 100%; flex: 1; text-align: center;}
.product-list .btn-box{display: flex; justify-content: flex-end; border-radius: 4px; overflow: hidden; border: 1px solid #ededed; margin-top: 8px;}
.product-list .btn-box.on{width: 100%;}
.product-list .btn-box.no{border: none;}
.product-list .btn-box.no .btn2{border: 1px solid #ededed; border-radius: 4px;}
.product-list .btn1{border-right: 1px solid #ededed;}
.product-list .btn2{border-left: 1px solid #ededed;}
.product-list .div{padding: 8px 10px;}


.my-cart{border: 1px solid #ededed; border-radius: 6px;}
.my-cart.box{border-radius: 6px; overflow: hidden;}
.my-cart-top{display:flex; align-items: center;justify-content: space-between; padding: 0 16px; height: 40px; background-color: #f5f5f5;}
.cart-list{padding: 0 16px; }
.cart-list .imgW{margin-right: 8px;}
.cart-list .item{display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #ededed; padding: 10px 0;}
.cart-list .img{width: 74px; height: 74px; border-radius: 4px; overflow: hidden;}
.cart-list .name-box{height: 46px;}
.cart-list .name{font-size: 14px; line-height: 20px;}
.cart-list .price{color: #999;}
.cart-list .total_price{font-weight: bold; color: red;}
.cart-list .btn{width: 26px; height: 26px; display: flex; align-items: center; justify-content: center;}
.cart-list .input{width: 100%; flex: 1; text-align: center;}
.cart-list .btn1{border-right: 1px solid #ededed;}
.cart-list .btn2{border-left: 1px solid #ededed;}
.cart-list .btn-box{display: flex; justify-content: flex-end; border-radius: 4px; overflow: hidden; border: 1px solid #ededed; margin-top: 8px;}
.cart-list .div2{text-align: right; width: 140px;}
.cart-list .div1{flex: 1; width: 100%;}
.cart-list .item:last-child{border-bottom: none;}

.box .cart-list{padding: 0;}
.box .cart-list .item{padding: 10px;}
.cart-submit{width: 100%; height: 40px; border-radius: 4px; background-color: #000; color: #fff; display: flex; align-items: center; justify-content: center; margin-top: 20px;}


.home-bottom{position: fixed; width: 100%; height: 60px; background-color: #fff; border-top: 1px solid #ededed; display: flex; align-items: center; justify-content: space-between; z-index: 980; left: 0; bottom: 0; padding: 0 16px;}
.home-bottom .red{color: red;font-weight: bold;}
.home-bottom .p1{color: #999; padding-bottom: 2px;}
.home-bottom .num{display: flex; align-items: center;}
.home-bottom .num .jt{width: 16px; transition: all ease .3s;}
.home-bottom .num .sp{margin: 0  6px;}
.home-bottom .num.on .jt{transform: rotate(180deg);}
.pup .cart-list{padding: 0 0 16px 0;}
.pup .my-cart{border: none;}
.pup .my-cart .item{border-bottom: 1px solid #ededed; padding: 10px 16px;}
.pup .cart-submit{margin: 0 auto; width: calc(100% - 32px);}
.pup .pup-box{padding-bottom: 16px;}
.pup .cart-list{max-height: calc(100vh - 200px); overflow-y: auto;}

.footer{position: fixed; width: 100%; background-color: #fff; display: flex; align-items: center; justify-content: space-between; z-index: 9999; left: 0; bottom: 0; text-align: center; font-size: 12px;}
.footer .ico{height: 20px; display: block; margin: 0 auto; width: 100%; background-repeat: no-repeat; background-size: auto 100%; background-position: center;}
.footer .dd{padding: 10px 0; width: 28%; color: #999;}
.footer .ico{}
.footer .dd1 .ico{background-image: url(../image/ft-icon1.png)}
.footer .dd2 .ico{background-image: url(../image/ft-icon2.png)}
.footer .dd3 .ico{background-image: url(../image/ft-icon3.png)}
.curNav1 .footer .dd1 .ico{background-image: url(../image/ft-icon1on.png)}
.curNav2 .footer .dd2 .ico{background-image: url(../image/ft-icon2on.png)}
.curNav3 .footer .dd3 .ico{background-image: url(../image/ft-icon3on.png)}
.curNav1 .footer .dd1 {color: #1296db;}
.curNav2 .footer .dd2 {color: #1296db;}
.curNav3 .footer .dd3 {color: #1296db;}

.order{background-color: #f5f5f5; min-height: 100vh; padding: 20px 4%; padding-bottom: 70px;}
.order .item{background-color: #fff; border-radius: 5px; overflow: hidden; margin-bottom: 10px;}
.order .item .top{display: flex; align-items: center; justify-content: space-between; padding: 10px 16px; border-bottom: 1px solid #ededed;}
.order .item .imgW{width: 75px; height: 75px; margin-right: 8px;}
.order .item .img{width: 100%; height: 100%; display: block; object-fit: cover;}
.order .item .price{color: #666;}
.order .item .total_price{color: red; font-weight: bold;}
.order .item .bottom{display: flex; align-items: center; justify-content: space-between; padding: 10px 16px;}
.order .item .time{color: #999; font-size: 12px;}
.order .item .status{width: 60px; display: flex; align-items: center; justify-content: center; border: 1px solid #ddd; border-radius: 4px; height: 30px;}
.order .item .bottom1{padding-top: 0; margin-top: -4px;}
#msg{position: fixed; left: 50%; top: 50%; padding: 16px; background-color: rgba(0,0,0,0.5); border-radius: 4px; overflow: hidden; color: #fff; z-index: 9999; display: none;}

.my{background: linear-gradient(180deg, #a0b1ff, #fff); padding: 30px 16px 50px; color: #fff; display: flex; align-items: center; }
.my .avatar{width: 80px; height: 80px; display: block; border-radius: 50%; margin-right: 10px;}
.my .name{font-size: 18px; font-weight: bold;}



.order-detail{background-color: #fff; border-radius: 5px; overflow: hidden;}
.order-detail .header{background: #6782ff}
.order-detail .top{display: flex; align-items: center; justify-content: space-between; padding: 16px 16px; border-top: 1px solid #ededed;}
.order-detail .top.b0{border-top: none;}
.order-detail .imgW{width: 75px; height: 75px; margin-right: 8px;}
.order-detail .img{width: 100%; height: 100%; display: block; object-fit: cover;}
.order-detail .top .div{flex: 1; width: 100%;}
.order-detail .top .price{color: #666; padding: 6px 0; font-size: 12px;}
.order-detail .top .total_price{color: red; font-weight: bold; font-size: 15px;}


.order-detail .header{padding: 26px 16px; color: #fff; margin-bottom: 10px;}
.order-detail .header .p1{padding-bottom: 8px;}
.order-detail .header .status{font-weight: bold; font-size: 18px;}

.order-detail .bottom{border-top: 10px solid #f5f5f5; padding: 10px 0; margin-top: 10px;}
.order-detail .bottom .item{padding: 6px 16px; display: flex; align-items: center; justify-content: space-between;}
.order-detail .bottom .lab{color: #888;}

